﻿<template>
    <full-screen-dialog
        :title="titleMap[mode]"
        v-model="visible"
        :width="1200"
        destroy-on-close
        :close-on-click-modal="false"
        :before-close="handleBeforeClose"
    >
        <el-form
            :model="entityObj"
            :rules="rules"
            :disabled="mode == 'Show'"
            ref="dialogForm"
            label-width="100px"
        >
            <el-row>
                <div class="w25pr30">
                    <el-form-item label-width="120px" label="盘点单号">{{entityObj.storeInventoryCode}}</el-form-item>
                </div>
                <div >
                    <el-form-item
                        label-width="120px"
                        label="盘点时间"
                    >{{entityObj.startDate}}-{{entityObj.endDate}}</el-form-item>
                </div>
            </el-row>
            <el-row>
                <el-col :span="24">
                    <el-table :data="entityObj.storeInventoryItems" border style="width: 100%;height: 800px;" show-summary>
                        <el-table-column label="物料编码" min-width="110">
                            <template #default="scope">{{scope.row.materialCode}}</template>
                        </el-table-column>
                        <el-table-column label="物料名称" min-width="130">
                            <template #default="scope">{{scope.row.materialName}}</template>
                        </el-table-column>
                        <el-table-column label="规格" min-width="110">
                            <template #default="scope">{{scope.row.materialSpecs}}</template>
                        </el-table-column>
                        <el-table-column label="物料类别" min-width="110">
                            <template #default="scope">{{scope.row.materialTypeName}}</template>
                        </el-table-column>
                        <el-table-column label="期初库存" min-width="90">
                            <template #default="scope">{{scope.row.startInventory}}</template>
                        </el-table-column>
                        <el-table-column label="吧台入库" min-width="90">
                            <template #default="scope">{{scope.row.barInventory}}</template>
                        </el-table-column>
                        <el-table-column label="客遗酒水回收" min-width="90">
                            <template #default="scope">{{scope.row.todayPickUp}}</template>
                        </el-table-column>
                        <el-table-column label="寄存过期回收" min-width="90">
                            <template #default="scope">{{scope.row.barStorageExpired}}</template>
                        </el-table-column>
                        <el-table-column label="售卖" min-width="90">
                            <template #default="scope">{{scope.row.saleInventory}}</template>
                        </el-table-column>
                        <el-table-column label="寄存" min-width="90">
                            <template #default="scope">{{scope.row.inStorageCount}}</template>
                        </el-table-column>
                        <el-table-column label="取出" min-width="90">
                            <template #default="scope">{{scope.row.outStorageCount}}</template>
                        </el-table-column>
                        <el-table-column label="总库存" min-width="90">
                            <template #default="scope">{{scope.row.totalInventory}}</template>
                        </el-table-column>
                        <el-table-column label="置换" min-width="130" prop="qty">
                            <template #default="scope">
                                <el-input-number
                                    v-model="scope.row.changeCount"
                                    style="width: 100%"
                                    :step="1"
                                    controls-position="right"
                                ></el-input-number>
                            </template>
                        </el-table-column>
                        <el-table-column label="本日实盘" min-width="130" prop="qty">
                            <template #default="scope">
                                <el-input-number
                                    v-model="scope.row.todayInventory"
                                    style="width: 100%"
                                    :step="1"
                                    controls-position="right"
                                ></el-input-number>
                            </template>
                        </el-table-column>
                        <el-table-column label="盘点差异" min-width="90">
                            <template
                                #default="scope"
                            >{{scope.row.todayInventory-(scope.row.totalInventory+scope.row.changeCount)}}</template>
                        </el-table-column>
                        <el-table-column label="备注" min-width="130">
                            <template #default="scope">
                                <el-input v-model="scope.row.remarks" style="width: 100%" />
                            </template>
                        </el-table-column>
                    </el-table>
                </el-col>
            </el-row>
        </el-form>

        <template #footer>
            <el-button @click="handleBeforeClose">取 消</el-button>
            <el-button
                v-if="mode != 'show'"
                type="primary"
                :loading="isSaveing"
                @click="submit()"
            >保 存</el-button>
        </template>
        <!-- 预览组件 -->
        <el-image-viewer
            v-if="showImage"
            @close="closeViewer"
            :hide-on-click-modal="true"
            :url-list="srcList"
        />
    </full-screen-dialog>
</template>



<script>
import tool from "@/utils/tool";
export default {
    emits: ["success", "closed"],
    data() {
        return {
            mode: "Add",
            titleMap: {
                Add: "新增",
                Edit: "编辑",
                Show: "查看",
            },
            entityObj: {
                applyOrderCode: "",
                applyDate: "",
                expectedDate: "",
                storeId: 0,
                storeName: "",
                realName: "",
                mobile: "",
                address: "",
                purchaseUnityId: 0,
                purchaseUnityName: "",
                purchaseRealName: "",
                applyName: "",
                createTime: "",
                remarks: "",
                otherFee: 0.0,
                totalAmount: 0.0,
                protocolFile: "",
                applyOrderItems: [],
            },
            orgType: 2,
            //预览图片
            previewUrl: [],
            //预览图片列表
            srcList: [],
            showImage: false,
            materialState: false,
            applyOrderState: false,
            storeQueryList: {},
            applyOrderQueryList: {},
            storeState: false,
            queryList: {},
            visible: false,
            isSaveing: false,
            needSaveFlag: false,
            purchaseUnityDisabledState: false,
            purchaseUnityProps: {
                label: "purchaseUnityName",
                value: "purchaseUnityId",
            },
            //验证规则
            rules: {},
            props: {
                label: "supplierName",
                value: "supplierId",
            },
            storeProps: {
                label: "storeName",
                value: "storeId",
            },
            materialProps: {
                label: "materialCode",
                value: "materialId",
                items: "materialItems",
            },
            materialTypeTree: [],
            optionsBrand: [],
            optionsUnit: [],
            optionsPurchaseUnity: [],
            itemsData: [],
            activeNames: [],
            isCollapsed: true, // 初始状态为收起
            defaultTime: [
                new Date(2000, 1, 1, 0, 0, 0),
                new Date(2000, 2, 1, 23, 59, 59),
            ],
            notesDialog: false,
            materialNotes: "",
        };
    },
    methods: {
        handleSelectionChanged(selectionRows) {
            this.setMaterialChoice();
        },
        //图片预览
        handlePreview(row) {
            console.log("row", row.materialImages);
            if (!row.materialImages || row.materialImages.length == 0) {
                return;
            }
            this.previewUrl = row.materialImages[0]; // 设置当前预览的图片 URL
            this.srcList = row.materialImages; // 设置预览列表
            this.showImage = true; // 显示 el-image
        },
        closeViewer() {
            this.showImage = false;
        },
        //显示=
        async open(mode = "Add") {
            this.mode = mode;
            this.visible = true;
            return this;
        },
        handleBeforeClose() {
            this.$confirm("信息未保存,确定要关闭吗？", "提示", {
                confirmButtonText: "确定",
                cancelButtonText: "取消",
                type: "warning",
            })
                .then(() => {
                    this.visible = false;
                })
                .catch(() => {
                    // 用户点击了取消按钮，不执行关闭
                });
        },
        //表单提交方法
        submit() {
            this.$refs.dialogForm.validate(async (valid) => {
                if (valid) {
                    this.isSaveing = true;
                    try {
                        var returnValue =
                            await this.$API.auth.PostProcessApi.post(
                                "store-inventory/save",
                                { ...this.entityObj }
                            );
                        if (returnValue.status == 200) {
                            this.$message.success("操作成功");
                            this.$emit("fatherMethod");
                            this.isSaveing = false;
                            this.visible = false;
                        } else {
                            this.$message.error("操作失败:" + returnValue.msg);
                            this.isSaveing = false;
                        }
                    } catch (error) {
                        this.loading = false;
                        this.isSaveing = false;
                        return false;
                    }
                }
            });
        },
        //表单注入数据
        async setData(data) {
            console.log('data',data)
            this.entityObj = data;
            try {
                var returnValue = await this.$API.auth.GetProcessApi.get(
                    `store-inventory/detail/${data.storeInventoryId}`,
                    {}
                );
                if (returnValue.status == 200) {
                    this.entityObj.storeInventoryItems = returnValue.response;
                } else {
                    this.$message.error("操作失败:" + returnValue.msg);
                }
            } catch (error) {
                this.loading = false;
                return false;
            }
        },
        async initOptions() {

        },
    },
    async mounted() {
        this.orgType = tool.data.get("USER_INFO").AccountType;
        await this.initOptions();
    },
};
</script>

<style lang="scss" scoped>
.add-material-but {
    text-align: center;
    width: 80px;
    height: 28px;
    background: #ffffff;
    border-radius: 4px;
    border: 1px solid #318cf2;
    line-height: 28px;
    font-family: Microsoft YaHei;
    font-weight: 400;
    font-size: 14px;
    color: #318cf2;
}

.add-order-but {
    margin-left: 10px;
    text-align: center;
    width: 160px;
    height: 28px;
    background: #ffffff;
    border-radius: 4px;
    border: 1px solid #318cf2;
    line-height: 28px;
    font-family: Microsoft YaHei;
    font-weight: 400;
    font-size: 14px;
    color: #318cf2;
}

.add-temporary-but {
    text-align: center;
    width: 100px;
    height: 28px;
    background: #ffffff;
    border-radius: 4px;
    border: 1px solid #318cf2;
    line-height: 28px;
    font-family: Microsoft YaHei;
    font-weight: 400;
    font-size: 14px;
    color: #318cf2;
}

.del-temp-but {
    text-align: center;
    width: 46px;
    height: 24px;
    background: #ffffff;
    border-radius: 4px;
    border: 1px solid #318cf2;
    font-family: Microsoft YaHei;
    font-weight: 400;
    font-size: 14px;
    color: #318cf2;
}

.w25pr30 {
    width: 25%;
    padding-right: 30px;
}
.w25 {
    width: 25%;
}

::v-deep .el-form-item__label {
    width: 100px !important;
    justify-content: flex-start;
}

.collapse-container {
    border-top: 1px solid #f6f6f6;
    border-bottom: 1px solid #f6f6f6;
    padding: 10px 10px 10px 0;
    margin-bottom: 10px;
}

.collapse-header {
    display: flex;
    justify-content: space-between;
    cursor: pointer;
    padding: 5px;
    padding-left: 0;
    font-weight: bold;
    font-size: 12px;
}
.collapse-content1 {
    padding: 10px;
    background: #f2f2f2;
}
.icon-img {
    width: 16px;
    height: 10px;
    margin-left: 5px;
}
</style>

<style scoped>
/deep/ .el-upload--picture-card {
    width: 50px;
    height: 50px;
}
/deep/ .el-upload {
    width: 50px;
    height: 50px;
    line-height: 50px;
}
/deep/ .el-upload-list--picture-card .el-upload-list__item {
    width: 50px;
    height: 50px;
    line-height: 50px;
}
/deep/ .el-upload-list--picture-card .el-upload-list__item-thumbnail {
    width: 50px;
    height: 50px;
    line-height: 50px;
}
/deep/ .el-table .info-row > td {
    background: #e4e7ed;
    user-select: none; /* 禁用文本选择 */
    pointer-events: none; /* 禁用鼠标事件 */
}
</style>
